<template>
  <div class="app-container">
    <el-form :model="queryParams" ref="queryForm" v-show="showSearch" :inline="true" size="small">
      <el-form-item label="需求编号" prop="operationalOrderCode">
        <el-input
          v-model="queryParams.operationalOrderCode"
          placeholder="请输入单据编号"
          clearable
          style="width: 240px"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="用工日期" prop="workTime">
        <el-date-picker
          v-model="queryParams.workTime"
          style="width: 200px"
          value-format="yyyy-MM-dd"
          type="date"
          placeholder="选择日期">
        </el-date-picker>
      </el-form-item>
      <el-form-item label="需求阶段" prop="taskNode">
        <el-select v-model="queryParams.taskNode" placeholder="请选择">
          <el-option
            v-for="item in taskOptions"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
        <el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>
    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button
          type="primary"
          plain
          icon="el-icon-plus"
          size="mini"
          @click="handleAdd"
          v-hasPermi="['plan:employee:add']"
        >新建</el-button>
      </el-col>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>
    <el-table v-loading="loading" :data="employeeList" >
      <el-table-column label="需求单号" prop="operationalOrderCode" min-width="130" align="center"/>
      <el-table-column label="用工日期" prop="workTime" width="110" align="center"/>
      <el-table-column label="班次" prop="timeShiftName" align="center"/>
      <el-table-column label="班组" prop="groupName" align="center">
        <template slot-scope="scope">
          <span>{{ convertColumn(scope.row.groupName) }}</span>
        </template>
      </el-table-column>
      <el-table-column label="预测业务量" width="100" prop="estimateBusinessNumber" align="center">
        <template slot-scope="scope">
          <span>{{ scope.row.estimateBusinessNumber}}w</span>
        </template>
      </el-table-column>
      <el-table-column label="预测用工量" width="100" prop="estimateWorkerNumber" align="center">
        <template slot-scope="scope">
          <span>{{ convertColumn(scope.row.estimateWorkerNumber) }}</span>
        </template>
      </el-table-column>
      <el-table-column label="需求阶段" prop="taskNode" align="center" >
        <template slot-scope="scope">
          <span>{{ getTaskNode(scope.row.taskNode) }}</span>
        </template>
      </el-table-column>
      <el-table-column label="订单状态" prop="status" align="center">
        <template slot-scope="scope">
          <span>{{ getStatusText(scope.row.status) }}</span>
        </template>
      </el-table-column>

      <el-table-column label="更新时间" prop="updateTime" width="180" align="center">
        <template slot-scope="scope">
          <span>{{ parseTime(new Date(scope.row.updateTime)) }}</span>
        </template>
      </el-table-column>

      <el-table-column label="操作" align="center"  class-name="small-padding" min-width="200" fixed="right">
        <template slot-scope="scope">
          <el-button
            type="text"
            size="mini"
            icon="el-icon-view"
            @click="handleView(scope.row)"
            v-hasPermi="['plan:employee:detail']">
            详情
          </el-button>
          <el-button
            v-if="[0,2,3,5,6,8,10].indexOf(scope.row.status) > -1"
            type="text"
            size="mini"
            icon="el-icon-edit"
            @click="handleUpdate(scope.row)"
            v-hasPermi="['plan:employee:edit']">
            编辑
          </el-button>
          <el-button
            v-if="[1,4,7,9].indexOf(scope.row.status) > -1"
            type="text"
            size="mini"
            icon="el-icon-edit"
            @click="handleRevoke(scope.row)"
            v-hasPermi="['plan:employee:revoke']">
            撤销审核
          </el-button>
          <el-button
            v-if="[10,11].indexOf(scope.row.status) <0"
            type="text"
            size="mini"
            icon="el-icon-delete"
            @click="handleDelete(scope.row)"
            v-hasPermi="['plan:employee:delete']">
            删除
          </el-button>
        </template>
      </el-table-column>
    </el-table>
    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />

    <!-- 添加或修改参数配置对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="600px" append-to-body>
      <el-form ref="form" :model="form"  label-width="80px">
        <el-row>
          <el-col :span="12">
            <el-form-item label="审核结果">
              <el-radio-group v-model="form.taskNode">
                <el-radio :label="1">通过</el-radio>
                <el-radio :label="2">不通过</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <!--        <el-row>-->
        <!--          <el-col :span="12">-->
        <!--            <el-form-item label="备注">-->
        <!--              <el-input v-model="form.remark" type="textarea" placeholder="请输入内容"></el-input>-->
        <!--            </el-form-item>-->
        <!--          </el-col>-->
        <!--        </el-row>-->
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
  import {  deleteQualityPredict , auditQualityPredict } from "@/api/job/qualityPredict/qualityPredict";
  import { getOperationalList, operationalDelete, delProcessInstance } from "@/api/plan/employee";
  export default {
    name: "attendanceGroup",
    created() {
      this.getList();
    },
    data() {
      return {
        //隐藏id列
        show:false,
        //signUpLoading:true,
        // 遮罩层
        loading: true,
        // 导出遮罩层
        exportLoading: false,
        // 选中数组
        ids: [],
        // 非单个禁用
        single: true,
        // 非多个禁用
        multiple: true,
        // 显示搜索条件
        showSearch: true,
        // 总条数
        total: 0,
        // 表格数据
        employeeList: [],
        taskOptions: [
          { value: 1, label: '件量预测' },
          { value: 2, label: '用工评估' },
          { value: 3, label: '零工预测' },
          { value: 4, label: '方案审核' },
          { value: 5, label: '用工完结' }
        ],
        statusList: [
          //件量预测
          { value: 0, label: '待处理' },
          { value: 1, label: '待审核' },
          { value: 2, label: '审核驳回' },
          //用工评估
          { value: 3, label: '待处理' },
          { value: 4, label: '待审核' },
          { value: 5, label: '审核驳回' },
          // 零工预测
          { value: 6, label: '待处理' },
          { value: 7, label: '待审核' },
          { value: 8, label: '审核驳回' },
          //方案审核
          { value: 9, label: '待审核' },
          //用工完结
          { value: 10, label: '待处理' },
          { value: 11, label: '已完成' },
        ],
        // 弹出层标题
        title: "",
        // 是否显示弹出层
        open: false,
        //是否显示弹出层（数据权限）
        openDataScope: false,
        menuExpand: false,
        menuNodeAll: false,
        deptExpand: true,
        deptNodeAll: false,
        // 日期范围
        dateRange: [],
        signUp:false,
        // 查询参数
        queryParams: {
          pageNum: 1,
          pageSize: 10,
          operationalOrderCode:undefined,
          workTime:undefined,
          taskNode:undefined
        },
        // 表单参数
        form: {
          qualityPredictId:undefined,
          //remark:undefined,
          taskNode:undefined,
        },
        defaultProps: {
          children: "children",
          label: "label",
        },
      };
    },

    computed: {
      getTaskNode: function(){
        return function (node) {
          let nodeText = node;
          this.taskOptions.forEach(item=>{
            if(item.value === node){
              nodeText = item.label;
            }
          });
          return nodeText;
        }

      },
      getStatusText: function(){
        return function (status) {
          let statusText = status;
          this.statusList.forEach(item => {
            if (item.value === status) {
              statusText = item.label;
            }
          });
          return statusText;
        }
      }
    },
    methods: {
      //转换表格列数据
      convertColumn(data){
        if(data === undefined || data === null || data === ''){
          return '— —'
        }
        return data;
      },
      // getTaskNode(node){
      //   console.log(node)
      // },
      /** 获取用工需求列表 */
      getList() {
        this.loading = true;
        getOperationalList(this.queryParams).then(
          response => {
            // console.log(response)
            this.employeeList = response.rows;
            this.total = response.total;
            this.loading = false;
          }
        );
      },
      handleAdd() {
        this.$router.push({path:"/plan/employeeAdd", query: { handleType: 'add'} });
      },
      handleView(row) {
        // console.log(row);
        const params = { id: row.id, status: row.status, handleType: 'view'};
        this.$router.push({ path:"/plan/employeeDetail", query: params });
      },
      handleUpdate(row){
        const params = { id: row.id, status: row.status, handleType: 'edit'};
        this.$router.push({ path:"/plan/employeeEdit", query: params });
      },
      //撤销审核
      handleRevoke(row){
        // console.log(row);
        this.$confirm('是否确认撤销审核?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(function() {
          const params = { taskId: row.id, reason:'撤销审核' };
          // console.log(params)
          return delProcessInstance(params);
        }).then(() => {
          this.getList();
          this.msgSuccess("撤销审核成功");
        }).catch(() => {});
      },
      /** 删除按钮操作 */
      handleDelete(row) {
        console.log(row)
        const id = row.id;
        this.$confirm('是否确认删除数据项?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(function() {
          return operationalDelete(id);
        }).then(() => {
          this.getList();
          this.msgSuccess("删除成功");
        }).catch(() => {});
      },
      /**审核按钮操作*/
      handleAudit(row){
        this.form.qualityPredictId = row.qualityPredictId;
        this.open = true;
        this.title = "审核";
      },
      // 表单重置
      reset() {
        this.form = {
          documentNumber:undefined,
          submitTime:undefined,
          taskNode:undefined,
        };
        this.resetForm("form");
      },
      /** 搜索按钮操作 */
      handleQuery() {
        this.queryParams.pageNum = 1;
        this.getList();
      },
      /** 重置按钮操作 */
      resetQuery() {
        // this.dateRange = [];
        this.resetForm("queryForm");
        this.handleQuery();
      },
      submitForm(){
        auditQualityPredict(this.form).then(es=>{
          this.msgSuccess(es.msg);
          this.open = false;
          this.getList()
        })
          .catch(()=>{
            this.msgError("审核失败");
          })},
      cancel(){
        this.open = false;
        this.form.qualityPredictId=undefined;
      },
    }
  };
</script>
